<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Crushの小窝</title>
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <script src="./js/jquery-3.3.1.slim.min.js"></script>
    <script src="./js/popper.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
<div class="container">
    <div class="topbar">
        <ul class="nav">
            <li><a href="#" class="text active">主页</a></li>
            <li><a href="./html/blog.html" class="text">博客</a></li>
            <li><a href="#" class="text">我的简历</a></li>
            <li><a href="#" class="text">关于</a></li>
        </ul>
        <div class="topbar-time">
            <span id="nowtime" class="text">{{ date }}</span>
        </div>
    </div>
    <div class="bg">
        <video id="bg-video" autoplay loop muted>
            <source id="bg-video-source" ref="bgVideo" :src="bgVideoSrc" type="video/mp4"  />
        </video>
        <img id="bg-pic" src="./res/img/bg-pic.png">
    </div>
    <div class="content pr">
        <div class="srh-content pa">
            <div class="input-group input-group-lg">
                <input type="text" class="form-control" placeholder="搜索博客" aria-describedby="srh-btn">
                <span class="input-group-addon glyphicon glyphicon-search" id="srh-btn"></span>
            </div>
        </div>
        <h1 class="text">I Have a DREAM</h1>
    </div>
    <div class="bottom-bar pa">
        <span class="glyphicon glyphicon-info-sign"></span>
        <a href="https://beian.miit.gov.cn/" id="right-link" target="_blank" data-toggle="popover"></a>
    </div>
</div>
<script src="./js/vue.js"></script>
<script src="./js/index.js"></script>
</body>
</html>